<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
    <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.0.min.js"></script>

    <script src="order-controller.js"></script>
    <link rel="stylesheet" href="styles.css">
</head>
<body ng-app="vaerditilbud">

<div ng-controller="OrderController">
   <p>{{customer}}</p>
   <div>
       <form ng-submit="updateCustomer()">
           <p style="display:inline;">Kundeansvarlig:</p>
           <input style="display:inline;" type="text" ng-model="customerResponsible.initials"/>
           <div style="display:inline;">{{customerResponsible.displayName}}</div>
       </form>
   </div>
   <div>Produkt1</div>
   <div>
        <p>Kunde vaerge:</p>
        <table>
            <thead>
                <tr>
                    <th></th>
                    <th>Navn</th>
                    <th>Adresse</th>
                    <th>Kontakt</th>
                    <th>Samtykke</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        <input type="checkbox" ng-model="customer.selected"/>
                    </td>
                    <td>{{customer.navn}}</td>
                    <td>{{customer.adress}}</td>
                    <td>
                        <select
                                data-ng-options="o.type for o in customer.kontaktList"
                                data-ng-model="customer.kontakt"
                                />
                        <input disabled="disabled" value="{{customer.kontakt.value}}"/>
                    </td>
                    <td>
                        <input type="checkbox" ng-model="customer.consent"/>
                    </td>
                </tr>
            </tbody>
        </table>
       <button ng-click="togglemodal()">Calculate</button>
       <modal title="Login form" show="showModal" width="750px" height="60%">
           <p>Modal Content Goes here<p>
       </modal>
    </div>
</div>

</body>
</html>